<template>
  <search-form
    :search-config="searchConfig"
    :label-width="150"
    @clear="clearSearch"
    @search="handleSearch"
  />
</template>
<script>
export default {
  name: 'Search',
  props: {
    type: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      searchConfig: [
        {
          type: 'select',
          prop: 'selectRemoteName',
          label: '任务来源',
          value: '',
          placeholder: '任务来源',
          config: {
            remote: true,
            paramField: 'keyWord', // 远程搜索参数名
            remoteUrl: `https://qup2dev.quanyou.com.cn/data-dict/api/v2/dictionary/PO_TYPE`,
            defaultProps: {
              label: 'dictName',
              value: 'dictCode'
            },
            paramsRaw: { appCode: 'order-center', domainCode: 'marketing' },
            filterable: true,
            focusQuery: false
          }
        },
        {
          label: '门店建设项目号',
          prop: 'txtName',
          type: 'text',
          value: '',
          placeholder: '门店建设项目号'
        },
        {
          label: '所属门店',
          prop: 'inputDlgName',
          type: 'dialog',
          value: '',
          placeholder: '所属门店',
          config: {
            requestMethod: 'get', // 远程搜索请求方式:post,get;默认为get
            remoteUrl:
              'https://qup2dev.quanyou.com.cn/mcenter/api/v1/messageType/list/keyWord', // 远程搜索API地址
            paramField: 'keyWord', // 远程搜索参数名
            defaultProps: {
              label: 'typeName',
              value: 'typeCode'
            }, // api返回数据默认字段
            multiple: true, 
            selectData: [
              { label: 'RD20200921000001', value: '4022' },
              { label: 'RD20200921000002', value: '4021' }
            ]
          },
          dialogConfig: {
            title: '所属门店',
            interfacePath:
              'https://qup2dev.quanyou.com.cn/mcenter/api/v1/messageType/page',
            setting: [
              { prop: 'typeCode', title: '类型编码' },
              { prop: 'typeName', title: '消息类型' }
            ]
          }
        },
        {
          label: '所属客户',
          prop: 'inputDlgName',
          type: 'dialog',
          value: '',
          placeholder: '所属客户',
          config: {
            requestMethod: 'get', // 远程搜索请求方式:post,get;默认为get
            remoteUrl:
              'https://qup2dev.quanyou.com.cn/mcenter/api/v1/messageType/list/keyWord', // 远程搜索API地址
            paramField: 'keyWord', // 远程搜索参数名
            defaultProps: {
              label: 'typeName',
              value: 'typeCode'
            }, // api返回数据默认字段
            multiple: true, 
            selectData: [
              { label: 'RD20200921000001', value: '4022' },
              { label: 'RD20200921000002', value: '4021' }
            ]
          },
          dialogConfig: {
            title: '所属客户',
            interfacePath:
              'https://qup2dev.quanyou.com.cn/mcenter/api/v1/messageType/page',
            setting: [
              { prop: 'typeCode', title: '类型编码' },
              { prop: 'typeName', title: '消息类型' }
            ]
          }
        },
        {
          label: '所属办事处',
          prop: 'inputDlgName',
          type: 'dialog',
          value: '',
          placeholder: '所属办事处',
          config: {
            requestMethod: 'get', // 远程搜索请求方式:post,get;默认为get
            remoteUrl:
              'https://qup2dev.quanyou.com.cn/mcenter/api/v1/messageType/list/keyWord', // 远程搜索API地址
            paramField: 'keyWord', // 远程搜索参数名
            defaultProps: {
              label: 'typeName',
              value: 'typeCode'
            }, // api返回数据默认字段
            multiple: true, 
            selectData: [
              { label: 'RD20200921000001', value: '4022' },
              { label: 'RD20200921000002', value: '4021' }
            ]
          },
          dialogConfig: {
            title: '所属办事处',
            interfacePath:
              'https://qup2dev.quanyou.com.cn/mcenter/api/v1/messageType/page',
            setting: [
              { prop: 'typeCode', title: '类型编码' },
              { prop: 'typeName', title: '消息类型' }
            ]
          }
        },
        {
          label: '产品配置人',
          prop: 'inputDlgName',
          type: 'dialog',
          value: '',
          placeholder: '产品配置人',
          config: {
            requestMethod: 'get', // 远程搜索请求方式:post,get;默认为get
            remoteUrl:
              'https://qup2dev.quanyou.com.cn/mcenter/api/v1/messageType/list/keyWord', // 远程搜索API地址
            paramField: 'keyWord', // 远程搜索参数名
            defaultProps: {
              label: 'typeName',
              value: 'typeCode'
            }, // api返回数据默认字段
            multiple: true, 
            selectData: [
              { label: 'RD20200921000001', value: '4022' },
              { label: 'RD20200921000002', value: '4021' }
            ]
          },
          dialogConfig: {
            title: '产品配置人',
            interfacePath:
              'https://qup2dev.quanyou.com.cn/mcenter/api/v1/messageType/page',
            setting: [
              { prop: 'typeCode', title: '类型编码' },
              { prop: 'typeName', title: '消息类型' }
            ]
          }
        },
        {
          type: 'select',
          prop: 'selectRemoteName',
          label: '产品配置类型',
          value: '',
          placeholder: '产品配置类型',
          config: {
            remote: true,
            paramField: 'keyWord', // 远程搜索参数名
            remoteUrl: `https://qup2dev.quanyou.com.cn/data-dict/api/v2/dictionary/PO_TYPE`,
            defaultProps: {
              label: 'dictName',
              value: 'dictCode'
            },
            paramsRaw: { appCode: 'order-center', domainCode: 'marketing' },
            filterable: true,
            focusQuery: false
          }
        },
        {
          type: 'select',
          prop: 'selectRemoteName',
          label: '产品分类明细',
          value: '',
          placeholder: '产品分类明细',
          config: {
            remote: true,
            paramField: 'keyWord', // 远程搜索参数名
            remoteUrl: `https://qup2dev.quanyou.com.cn/data-dict/api/v2/dictionary/PO_TYPE`,
            defaultProps: {
              label: 'dictName',
              value: 'dictCode'
            },
            paramsRaw: { appCode: 'order-center', domainCode: 'marketing' },
            filterable: true,
            focusQuery: false
          }
        },
        {
          type: 'select',
          prop: 'selectRemoteName',
          label: '发货方式',
          value: '',
          placeholder: '发货方式',
          config: {
            remote: true,
            paramField: 'keyWord', // 远程搜索参数名
            remoteUrl: `https://qup2dev.quanyou.com.cn/data-dict/api/v2/dictionary/PO_TYPE`,
            defaultProps: {
              label: 'dictName',
              value: 'dictCode'
            },
            paramsRaw: { appCode: 'order-center', domainCode: 'marketing' },
            filterable: true,
            focusQuery: false
          }
        },
        {
          type: 'select',
          prop: 'selectRemoteName',
          label: '产品配置进度',
          value: '',
          placeholder: '产品配置进度',
          config: {
            remote: true,
            paramField: 'keyWord', // 远程搜索参数名
            remoteUrl: `https://qup2dev.quanyou.com.cn/data-dict/api/v2/dictionary/PO_TYPE`,
            defaultProps: {
              label: 'dictName',
              value: 'dictCode'
            },
            paramsRaw: { appCode: 'order-center', domainCode: 'marketing' },
            filterable: true,
            focusQuery: false
          }
        },
        {
          type: 'select',
          prop: 'selectRemoteName',
          label: '产品配置状态',
          value: '',
          placeholder: '产品配置状态',
          config: {
            remote: true,
            paramField: 'keyWord', // 远程搜索参数名
            remoteUrl: `https://qup2dev.quanyou.com.cn/data-dict/api/v2/dictionary/PO_TYPE`,
            defaultProps: {
              label: 'dictName',
              value: 'dictCode'
            },
            paramsRaw: { appCode: 'order-center', domainCode: 'marketing' },
            filterable: true,
            focusQuery: false
          }
        }
      ]
    }
  },
  watch: {
    type: {
      handler(v) {
        if (v !== 'decoration') {
          const filterList = '产品配置类型 产品分类明细 发货方式 产品配置状态'.split(' ')
          this.searchConfig = this.searchConfig.filter(e => {
            return !filterList.includes(e.label)
          })
        }
      },
      immediate: true
    }
  },
  methods: {
    // 清空搜索条件
    clearSearch(data) {
      this.$emit('clear', data)
    },
    // 获取搜索条件
    handleSearch(data) {
      this.$emit('search', data)
    }
  }
}
</script>
